<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
<title>滚轮效果 - Liehuo.Net</title>
</head>
<body>
鼠标滚轴:<input type="text" id="txt" value="0" />
<script type="text/javascript">
var oTxt=document.getElementById("txt");
/***********************
* 函数：判断滚轮滚动方向
* 参数：event
* 返回：滚轮方向 1：向上 -1：向下
*************************/
var scrollFunc=function(e){
var direct=0;
e=e || window.event;
if(e.wheelDelta){
direct=e.wheelDelta>0?1:-1;
}else if(e.detail){
direct=e.detail<0?1:-1;
}
ScrollText(direct);
}
/****************************
* 函数：控制文本框文字
* 参数：滚轮方向（由scrollFunc返回）
* 返回：无
*******************************/
function ScrollText(arg){
oTxt.focus();
var _value=parseInt(oTxt.value);
if(arg>0){
_value++;
}else{
_value--;
}
oTxt.value=_value;
oTxt.select();//选取效果
}
/*注册事件*/
if(document.addEventListener){
document.addEventListener('DOMMouseScroll',scrollFunc,false);
}//W3C
window.onmousewheel=document.onmousewheel=scrollFunc;
//IE/<a href='http://www.veryhuo.com/z/opera/' target='_blank'><b>Opera</b></a>/<a href='http://www.veryhuo.com/z/chrome/' target='_blank'><b>Chrome</b></a>
</script>
</body>
</html>